<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>test12</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
	<!-- <link rel="stylesheet" href="css/pGis.css" media="all"> -->
	<link rel="stylesheet" href="css/map.css" media="all">
</head>

<body>
	<div class="content">
		<div class="layui-row layui-col-space1 par-box" id="pgis_app">
			<div class="left_box">
				<div class="gridbox">
					<div class="layui-col-md1 toolbar">
						<div class="case_grid">
							<ul>
								<li><i class="zkuasgm-icon">&#xe9bd;</i>
									<p>选择网格</p>
								</li>
								<li><i class="zkuasgm-icon">&#xe606;</i>
									<p>自由勾画</p>
								</li>
								<li zkmap-event="openSearch"><i class="zkuasgm-icon">&#xe60c;</i>
									<p>新图层</p>
								</li>
							</ul>
						</div>
						<div class="tag_list_left">
							<ul>
								<li zkmap-event="rygj" id="rygj"><i class="zkuasgm-icon">&#xe614;</i>
									<!-- <span class="close" zkmap-event="clearSearch"><i class="zkuasgm-icon">&#xe629;</i></span> -->
									<p>人员轨迹</p>
									<p class="num_line"><span class="layui-badge">61728</span></p>
								</li>
								<!-- <li zkmap-event="maptool"><i class="zkuasgm-icon">&#xe60e;</i>
									<p>地图工具</p>
								</li> -->
								<li zkmap-event="tsrq" id="tsrq"><i class="zkuasgm-icon">&#xe61a;</i>
									<p>特殊人员</p>
									<p class="num_line"><span class="layui-badge">61728</span></p>
								</li>
								<li zkmap-event="sst" id="sst"><i class="zkuasgm-icon">&#xe65d;</i>
									<p>摄像头</p>
								</li>
							</ul>

						</div>
						
					</div>
					<div class="layui-col-md2 toolsBox">
						<div class="btn_box flex_relative" id="common">

						</div>
					</div>
				</div>

			</div>
			<!-- leftbox -->

			<div class="layui-col-md9 r-box" id="move-right">
				<div class="layui-row grid-demo">
					<div>
						<span><i class="zkuasgm-icon toggleMenu" data-state="1" zkmap-event="toggleLeft">&#xe9be;</i></span>
					</div>
					<div class="layui-col-md12 r-title">
						<div class="layui-row layui-col-space5 countboxs">
							<div>
								<ul>
									<li><span><i class="zkuasgm-icon">&#xe6c1;</i>当日结办<i class="number">(131)</i></span></li>
									<li><span><i class="zkuasgm-icon">&#xe63f;</i>累计事件<i class="number">(131)</i></span></li>
									<li><span><i class="zkuasgm-icon">&#xe8ff;</i>实有房屋<i class="number">(131)</i></span></li>
									<li><span><i class="zkuasgm-icon">&#xe640;</i>当日采集<i class="number">(131)</i></span></li>
									<li><span><i class="zkuasgm-icon">&#xe604;</i>累计排查<i class="number">(131)</i></span></li>
								</ul>
							</div>
							<!-- <div class="btn-box">
								<button class="layui-btn" target-name="incident" name="事件"><i class="zkuasgm-icon">&#xe64b;</i>事件<i class="tip">12</i></button>
								<button class="layui-btn" target-name="monitor" name="摄像头"><i class="zkuasgm-icon">&#xe666;</i>摄像头<i class="tip bg1">5</i></button>
								<button class="layui-btn" target-name="internet" name="物联网"><i class="zkuasgm-icon">&#xe7b2;</i>物联网<i class="tip bg3">8</i></button>
							</div> -->
						</div>
					</div>
					<div class="layui-col-md12 b-map-box" id="r-map">
						<div class="grid-demo grid-demo-bg3">
							
						</div>
					</div>
				</div>
				<div class="floatBox">
					<div class="search_tag_box">
						<ul>
							<!-- <li name="sear1"><i class="zkuasgm-icon">&#xe60c;</i>地图搜索</li> -->
							<li class="hov" name="sear2"><i class="zkuasgm-icon">&#xe60c;</i>高级搜索</li>
						</ul>
					</div>
					<!-- <div class="item search-bar" id="sear1">
						<div class="layui-form-item">
							<div class="layui-inline ip-line">
								<input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入关键字" class="layui-input" zkmap-event="searchList">
								<span class="search_btn"><i class="zkuasgm-icon">&#xe60c;</i></span>
								<div class="think_box" style="display:none">
									<ul>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果1
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果2
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果1
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果2
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果1
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果2
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果1
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果2
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果1
										</li>
										<li>
											<span class="icon">
												<i class="zkuasgm-icon">&#xe60c;</i>
											</span>
											搜索结果2
										</li>
									</ul>
								</div>
							</div>
						</div>
					</div> -->
					<div class="layui-form search-bar" id="sear2">
						<div class="layui-form-item">
							<div class="layui-inline">
								<select name="city" lay-verify="">
									<option value="">请选择</option>
									<option value="010">业务</option>
									<option value="021">门牌号</option>
									<option value="0571">兴趣点</option>
								</select>
							</div>  
							<div class="layui-inline">
								<input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入关键字" class="layui-input">
							</div>
						</div>
					</div>

					<div class="map-layer">
						<h2>图层</h2>
						<ul>
							<li><a href="####" zkmap-event="rygj"><span class="icon_around bg_around1"><i class="zkuasgm-icon">&#xe614;</i></span><span class="text">人员轨迹</span></a></li>
							<li><a href="####" zkmap-event="tsrq"><span class="icon_around bg_around2"><i class="zkuasgm-icon">&#xe61a;</i></span><span class="text">特殊人群</span></a></li>
							<li><a href="####" zkmap-event="sst"><span class="icon_around bg_around3"><i class="zkuasgm-icon">&#xe65d;</i></span><span class="text">摄像头</span></a></li>
							<li><a href=""><span class="icon_around bg_around4"><i class="zkuasgm-icon">&#xe604;</i></span><span class="text">当日事件</span></a></li>
							<li><a href=""><span class="icon_around bg_around5"><i class="zkuasgm-icon">&#xe696;</i></span><span class="text">出租房</span></a></li>
							<li><a href=""><span class="icon_around bg_around6"><i class="zkuasgm-icon">&#xe64c;</i></span><span class="text">重点青少年</span></a></li>
							<li><a href=""><span class="icon_around bg_around0"><i class="zkuasgm-icon">&#xe601;</i></span><span class="text">其他</span></a></li>
							<li><a href=""><span class="icon_around bg_around0"><i class="zkuasgm-icon">&#xe601;</i></span><span class="text">其他</span></a></li>
							
						</ul>
					</div>
				</div>
				<!-- 浮动搜索框 -->
				
				<div id="allmap"></div>

				<div class="floatTools">
						<ul>
							<li>
								<a href="####">
									<p><i class="zkuasgm-icon">&#xe606;</i></p>
									<p>勾画</p>
									<div class="more">1</div>
								</a>
								<div class="smenu">
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe636;</i></p>
										<p>线路两旁</p>
									</a>
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe623;</i></p>
										<p>地点周边</p>
									</a>
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe85b;</i></p>
										<p>任意区域</p>
									</a>
								</div>
							</li>
							<li>
								<a href="####">
									<p><i class="zkuasgm-icon">&#xe607;</i></p>
									<p>测量</p>
								</a>
							</li>
							
							<li>
								<a href="####">
									<p><i class="zkuasgm-icon">&#xe620;</i></p>
									<p>底图</p>
									<div class="more">1</div>
								</a>
								<div class="smenu">
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe884;</i></p>
										<p>二维地图</p>
									</a>
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe647;</i></p>
										<p>三维地图</p>
									</a>
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe6d1;</i></p>
										<p>正射影像</p>
									</a>
								</div>
							</li>
							<li>
								<a href="####">
									<p><i class="zkuasgm-icon">&#xe662;</i></p>
									<p>样式</p>
									<div class="more">1</div>
								</a>
								<div class="smenu">
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe9bd;</i></p>
										<p>网格</p>
									</a>
									<a href="####">
										<p><i class="zkuasgm-icon">&#xe811;</i></p>
										<p>网路</p>
									</a>
								</div>
							</li>
							<li>
								<a href="####">
									<p><i class="zkuasgm-icon">&#xe63d;</i></p>
									<p>其他</p>
								</a>
							</li>
							<li>
								<a href="####">
									<p><i class="zkuasgm-icon">&#xe9c0;</i></p>
									<p>全屏</p>
								</a>
							</li>
							<li>
								<a href="####">
									<p><i class="zkuasgm-icon">&#xe612;</i></p>
									<p>清除</p>
								</a>
							</li>
						</ul>
					</div>
			</div>
		</div>
	</div>




</body>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=ESXpb9G3PmhTyyiwPLelxkx47i8Mi50w"></script>
<script type="text/javascript" src="../../layuiadmin/layui/layui.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript"> 
	var map = new BMap.Map("allmap");
	map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);

	map.addControl(new BMap.NavigationControl({offset:new BMap.Size(0, 80),anchor: BMAP_ANCHOR_BOTTOM_RIGHT, type: BMAP_NAVIGATION_CONTROL_LARGE}));
	
	</script>  
</html>